<template>
  <div class="section-list">
    <ul>
      <li @click="click" v-for="(item,index) in data" :key="index">
        <router-link :to="`/article/${articleId}?section=${item.id}`" replace>
        {{item.name}}
        </router-link>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  props:{
    data:Array,
    articleId:[Number,String]
  },
  methods:{
    click(){
      this.$emit('link')
    }
  }
}
</script>

<style>
/* 章节 */
.section-list{
  font-size: 14px;
}
.section-list>ul>li{
  line-height: 46px;
  padding: 0 15px;
  border-top: 1px dotted #998D80;
  white-space: nowrap;
}
.section-list>ul>li>a{
  display: block;
  color: #1D2C33;
  text-indent: 2em;
  overflow:hidden;
  text-overflow: ellipsis;
}
.section-list>ul>li:first-child{
  border:0;
}
</style>
